<template>
  <h1>单选组件</h1>
  <el-radio-group v-model="edu">
    <el-radio label="学历:专科" value="zk"></el-radio>
    <el-radio label="学历:本科" value="bk"></el-radio>
    <el-radio label="学历:硕士" value="ss"></el-radio>
    <el-radio label="学历:博士" value="bs"></el-radio>
  </el-radio-group>
  <h4>选择的学历是：{{edu}}</h4>


  <el-radio-group v-model="res">
    <el-radio v-for="item in arr" :label="item.level" :value="item.value"></el-radio>
  </el-radio-group>
  <h4>您选择的值为：{{res}}</h4>
  <hr>
  el
</template>

<script setup>
import { ref } from 'vue';
//定义变量用来保存学历单选选中的值
const edu = ref('bk');

//要求：定义数组保存员工职级 员工10 经理20 总监30 总裁40 {level:'员工’，value：10}
const arr = ref([
  {level:'员工',value:10},
  {level:'经理',value:20},
  {level:'总监',value:30},
  {level:'总裁',value:40}
]);
//遍历次数组，生成单选，在页面中显示 您选择的职级为10
// 定义变量用来保存用户选择的职级值
const res = ref(10);

</script>

<style scoped>

</style>